<div class="container">
    <div class="row row-offcanvas row-offcanvas-right">
        <div class="col-xs-12 col-sm-9">
            <div class="table-responsive" *ngIf="page && page.content; else noData">
                <!--  -->
                <table class="table table-hover table-striped">
                    <caption>需求列表</caption>
                    <thead>
                        <tr>
                            <th>标题</th>
                            <th>类型</th>
                            <th>简介</th>
                            <th>时间</th>
                            <th>状态</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr *ngFor="let item of page.content" (click)="onSelect(item)" [class.active]="item === selected">
                            <td>{{item.id}}</td>
                            <td>{{item.title}}</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td><button class="" (click)="delete(item); $event.stopPropagation()">x</button></td>
                        </tr>
                    </tbody>
                </table>
                <nav aria-label="...">
                    <ul class="pagination">
                        <li><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li>
                        <li><a href="#">1</a></li>
                        <li><a href="#">2</a></li>
                        <li><a href="#">3</a></li>
                        <li><a href="#">4</a></li>
                        <li><a href="#">5</a></li>
                        <li><a href="#" aria-label="Next"><span aria-hidden="true">»</span></a></li>
                    </ul>
                </nav>
            </div>
            <ng-template #noData>暂无数据</ng-template>
            <!--/row-->
        </div>
        <!--/.col-xs-12.col-sm-9-->
        <div class="col-xs-6 col-sm-3 sidebar-offcanvas" id="sidebar">
            <H1>&nbsp;</H1>
            <ul class="list-group">
                <li class="list-group-item active">
                    <span class="badge">14</span> 待支付
                </li>
                <li class="list-group-item">待处理</li>
                <li class="list-group-item">已完成</li>
                <li class="list-group-item">全部订单</li>
            </ul>
        </div>
        <!--/.sidebar-offcanvas-->
    </div>
    <!--/row-->

    <hr>

</div>
<!--/.container-->